<template>
  <view>
    <view class="login-container">
      <uni-icons type="contact-filled" size="100" color="#AFAFAF"></uni-icons>
      <button type="primary" @click="getUserProfile"  class="btn-login">一键登录</button>
      <text class="tips-text">登录后尽享更多权益</text>
    </view>
  </view>
</template>

<script>
  import {mapMutations,mapState}from 'vuex'
  export default {
    name: "my-login",
    data() {
      return {

      };
    },
      computed:{
        ...mapState('m_user',['redirectInfo'])
      },
    methods:{
      ...mapMutations('m_user',['updateUserInfo','updateToken','updateRedirectInfo']),
      getUserProfile() {
          uni.getUserProfile({
           desc: '请求授权', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
           success: (res) => {
            // console.log(res)
            this.updateUserInfo(res.userInfo)
           
            this.getToken(res)
           },
           fail: (res) => {
            return uni.$showMsg("已取消登录授权")
           }
          })
         },
       async  getToken(info){
           const [err,res]=await uni.login().catch(err=>err)
           // console.log(res);
           if(  err ||res.errMsg !=='login:ok') return uni.$showMsg('登陆失败')
           // console.log(res.code);
           // console.log(info);
           // 准备参数对象
             const query = {
               code: res.code,
               encryptedData: info.encryptedData,
               iv: info.iv,
               rawData: info.rawData,
               signature: info.signature
             }
           console.log(query);
             // 取 token
             // const { data: loginResult } = await uni.$http.post('/api/public/v1/users/wxlogin', query)
             //获取token失败时候使用
             const loginResult = {
               "message": {
                 "user_id": 12,
                 "user_email_code": null,
                 "is_active": null,
                 "user_sex": "男",
                 "user_qq": "",
                 "user_tel": "",
                 "user_xueli": "本科",
                 "user_hobby": "",
                 "user_introduce": null,
                 "create_time": 1525402223,
                 "update_time": 1525402223,
                 "token": "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjIzLCJpYXQiOjE1NjQ3MzAwNzksImV4cCI6MTAwMTU2NDczMDA3OH0.YPt-XeLnjV-_1ITaXGY2FhxmCe4NvXuRnRB8OMCfnPo"
               },
               "meta": {
                 "msg": "登录成功",
                 "status": 200
               }
             }
             
             // console.log(loginResult);
             if (loginResult.meta.status !== 200) return uni.$showMsg('登录失败！')
             uni.$showMsg('登录成功')
             this.updateToken(loginResult.message.token)
             this.navgeteBack()
         },
         navgeteBack(){
           if(this.redirectInfo && this.redirectInfo.openType==='swichTab'){
             uni.switchTab({
               url:this.redirectInfo.from,
               complete: () => {
                 this.updateRedirectInfo(null)
               }
             })
           }
         }
      
    }
  }
</script>

<style lang="scss">
  .login-container {
    height: 750rpx;
    background-color: #F8F8F8;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: hidden;

    &::after {
      content: ' ';
      display: block;
      width: 100%;
      height: 40px;
      background-color:#f5f5f5 ;
      position: absolute;
      bottom: 0;
      left: 0;
      border-radius: 50%;
      transform: translateY(50%);
    }

    .btn-login {
      width: 90%;
      background-color: #C00000;
      border-radius: 100px;
    }

    .tips-text {
      color: gray;
      margin-top: 10px;
    }
  }
</style>
